<template>
    <div style="width: 100%;height: 100%;">
        <div>用户名：{{ $store.state.user.username }}</div>
        <div>真实姓名：{{ $store.state.user.realname }}</div>
        <div>
            <el-button type="primary" size="small" @click="logout">退出</el-button>
        </div>
    </div>
</template>
<script>
    import * as loginApi from "@/api/login";

    export default {
        methods: {
            async logout() {
                try {
                    let res = await loginApi.logout();
                    if (res.code != 200) {
                        this.$message.error(res.message);
                        return;
                    }
                } catch (error) {
                    this.$message.error("操作异常：" + error.message);
                }finally {
                    //清空内存
                    this.$store.dispatch("user/clearUserInfo");
                    //跳转登录页
                    window.location.reload();
                }
            }
        }
    }
</script>